import React, { Component } from 'react'
import { connect } from 'react-redux'
import ServerBgImage from '@com/ServerBgImage'

class MaterialSwiperItem extends Component {
  render() {
    const { item, index, currentIndex } = this.props
    return (
      <ServerBgImage
        className={`live_swiper_item ${currentIndex === index ? 'show' : 'hide'}`}
        bg={item.img}
      />
    )
  }
}

const mapStateToProps = (state) => {
  return {
    currentIndex: state.MaterialState.index
  }
}

export default connect(mapStateToProps)(MaterialSwiperItem)
